//
//  SwiftUIView.swift
//  ClockIn
//
//  Created by enrique leo on 8/8/21.
//

import SwiftUI

struct ClockListView: View {

    var body: some View {
        NavigationView{
            ZStack{
                GradientBackground().edgesIgnoringSafeArea(/*@START_MENU_TOKEN@*/.all/*@END_MENU_TOKEN@*/)
                
                VStack(){
                    ScrollView{
                        Spacer()
                        
                        ForEach(0 ..< 20) { number in
                            ListRowView(date: "2021-08-08", place: "SYSU", share: "心得 \(number)")
                                .frame(width: UIScreen.main.bounds.width * 0.85, alignment: .leading)
                                .padding()
                                .background(Color.white)
                        }
                    }
                    .padding()
                    .frame(
                        width: UIScreen.main.bounds.width * 0.85,
                        height: UIScreen.main.bounds.height * 0.75,
                        alignment: .center)
//                    .offset(y: 100.0)
                    
                }
                .navigationBarItems(leading: searchBar)
            }
        }
    }
}

extension ClockListView {
    private var searchBar : some View{
        HStack{
            CircleImage(image: Image("chilkoottrail"), width: 50, height: 50)
            
            Spacer()
            
            ZStack{
                Capsule()
                    .fill(Color.white)
                
                HStack{
                    Image(systemName: "magnifyingglass")
                        .offset(x: 10)
                    Spacer()
                }
                
            }
            .offset(x: /*@START_MENU_TOKEN@*/10.0/*@END_MENU_TOKEN@*/)
            .frame(width: UIScreen.main.bounds.width * 0.70, height: 30)}
    }
}

struct ClockListView_Previews: PreviewProvider {
    static var previews: some View {
        ClockListView()
    }
}
